<script setup>
import { ref } from 'vue';
import {useRouter} from "vue-router";
const router=useRouter();

import {showToast} from "vant";
import {get, post} from "../../util/request.js";



const onLoad = ()=>{
  get('message/findAllMassage').then((data) => {
    console.log(JSON.stringify(data))
    console.log("获取处理器的数据：" + JSON.stringify(data))
    var r = data;

    // 加载状态结束
    loading.value = false;
    finished.value = true

    if (r.code == 0) {
      showToast("查询成功");
      notifications.value = r.data;// 初始化界面

    } else {
      showToast("查询失败");
    }


  })
}

  const loading = ref(false);
  const finished = ref(false);
  const syMessages = [
      { id: 1, content: '关于建筑考试内容有什么建议吗？' },
      { id: 2, content: '如何写一封好的建筑信？' },
      // 其他私信内容
    ];
  const activeTab = ref('私信');
  const notifications =ref({})

  const inputMessage = ref('');
  const messages = ref([
    { type: 'received', content: 'Hello, how can I help you?' },
    { type: 'sent', content: 'I have a question about the architecture exam' }
    // 其他消息内容
  ]);

  const handleSendMessage = (message) => {
    messages.value.push({ type: 'sent', content: message });
  };
  //获取用户登录id
  const userId = localStorage.getItem('userId');
  const sendMessage = () => {
    // if (inputMessage.value.trim() !== '') {
    //   handleSendMessage(inputMessage.value);
    //   inputMessage.value = '';
    // }
    post('message/sendMassage',{
      content: inputMessage.value,
    }).then((data) => {
      console.log(JSON.stringify(data))
      console.log("获取处理器的数据：" + JSON.stringify(data))
      var r = data;

      // 加载状态结束
      loading.value = false;
      finished.value = true

      if (r.code == 0) {
        showToast("发送成功");
        notifications.value = r.data;// 初始化界面

      } else {
        showToast("发送失败");
      }


    })
    console.log(messages.value);
  };

  const onClickLeft = () => {
    router.push('/my');
  };




</script>

<template>
<h1 style="text-align: center">消息列表</h1><br>

  <van-nav-bar
      title="我的消息"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
  />
  <div>


    <van-tabs v-model:active="activeTab">
      <van-tab title="私信">
        <van-list
            v-model:loading="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="onLoad"
        >
          <van-cell
              v-for="messages1 in notifications"
              :key="messages1.id"
              :is-link="false"
              :title="messages1.content"
          >

            <template #label>
              <div>{{messages1.id}}</div>
<!--              <div>{{messages1.content}}</div>-->

            </template>

          </van-cell>
        </van-list>
      </van-tab>
      <van-tab title="通知">
        <van-list
            v-model:loading="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="onLoad1"
        >
          <van-cell
              v-for="messages2 in syMessages"
              :key="messages2.id"
              :is-link="false"
              :title="messages2.content"
          >

          </van-cell>
        </van-list>

      </van-tab>
    </van-tabs>
  </div>
  <div>
<!--    <van-chat ref="chat" :messages="messages" @send="handleSendMessage" />-->
    <van-field v-model="inputMessage" label="发送消息" placeholder="请输入消息内容" /><br>
    <van-button type="primary" @click="sendMessage">发送</van-button>
  </div>
</template>

<style scoped>

</style>